<!DOCTYPE HTML>
<html  lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<style type="text/css">
	.check-box {
		display: inline-block;
		box-sizing: border-box;
		cursor: pointer;
		position: relative;
		padding-left: 25px;
		padding-right: 15px;
		padding-top: 8px;

	}
	.cc {
		display: inline-block;
		box-sizing: border-box;
		cursor: pointer;
		position: relative;
		/*padding-left: 25px;*/
		padding-right: 15px;
		padding-top: 8px;
		margin-left: -25px;
		margin-top: -18px;
	}
</style>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-user-edit" th:object="${user}">
            <input id="id" name="id" th:field="*{id}"  type="hidden">
			<input name="deptId" th:field="*{deptId}" type="hidden" id="treeId"/>
			<div class="form-group">
				<label class="col-sm-3 control-label">供电单位：</label>
				<div class="col-sm-8">
					<input class="form-control" type="text" th:field="*{dept.deptName}" name="deptName" onclick="selectDeptTree()" readonly="true" id="treeName">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">电费类别：</label>
				<div class="col-sm-8" th:with="type=${@dict.getType('user_type')}">
					<label th:each="dict : ${type}" class="check-box">
						<label>
							<input id="unType" name="unType" th:field="*{userType}" class="form-control" type="hidden">
							<input class="userType" name="userType" type="checkbox" th:value="${dict.dictValue}"
								   th:text="${dict.dictLabel}" >
						</label>
					</label>
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-3 control-label">名称：</label>
				<div class="col-sm-8">
					<input id="name" name="name" th:field="*{name}" class="form-control" type="text">
				</div>
			</div>
			<div class="form-group">	
				<label class="col-sm-3 control-label">上网电厂结构：</label>
				<div class="col-sm-8">
					<select id="upStructure" class="form-control m-b" name="upStructure"  th:with="type=${@dict.getType('up_structure')}">
						<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:field="*{upStructure}" th:value="${dict.dictValue}"></option>
					</select>
				</div>
			</div>
			<div class="form-group">	
				<label class="col-sm-3 control-label">电压等级：</label>
				<div class="col-sm-8">
					<select id="voltageGrade" class="form-control m-b" name="voltageGrade"  th:with="type=${@dict.getType('voltage_grade')}">
						<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:field="*{voltageGrade}" th:value="${dict.dictValue}"></option>
					</select>
				</div>
			</div>
			<div class="form-group">	
				<label class="col-sm-3 control-label">用户户号：</label>
				<div class="col-sm-8">
					<input id="userNum" name="userNum" th:field="*{userNum}" class="form-control" type="text">
				</div>
			</div>
			<div class="form-group">	
				<label class="col-sm-3 control-label">用电类别：</label>
				<div class="col-sm-8">
					<select id="useEleType" class="form-control m-b" name="useEleType"  th:with="type=${@dict.getType('use_ele_type')}">
						<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:field="*{useEleType}" th:value="${dict.dictValue}"></option>
					</select>
				</div>
			</div>
			<div class="form-group">	
				<label class="col-sm-3 control-label">用电替代方案类别：</label>
				<div class="col-sm-8">
					<select id="useEleChangeType" class="form-control m-b" name="useEleChangeType"  th:with="type=${@dict.getType('use_ele_change_type')}">
						<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:field="*{useEleChangeType}" th:value="${dict.dictValue}"></option>
					</select>
				</div>
			</div>
			<div class="form-group">	
				<label class="col-sm-3 control-label">地址：</label>
				<div class="col-sm-8">
					<input id="address" name="address" th:field="*{address}" class="form-control" type="text">
				</div>
			</div>
		</form>
    </div>
    <div th:include="include::footer"></div>
    <script type="text/javascript">

//		 只执行一次，实现复选框回显选中
        var cc = true;
        if(cc){
            var userType = $("input[name='userType']").val();
            for(var index=0;index<userType.length;index++){
                $('input:checkbox[value="' + userType[index] + '"]').prop('checked',true);
            }
            cc = false;
        }


		var prefix = ctx + "basics/user"
		$("#form-user-edit").validate({
			rules:{
				xxxx:{
					required:true,
				},
			}
		});


		function submitHandler() {
	        if ($.validate.form()) {
//	            $.operate.save(prefix + "/edit", $('#form-user-edit').serialize());
                edit();
	        }
	    }

        function edit() {
            var id = $("input[name='id']").val();
            var deptId = $("input[name='deptId']").val();
            var deptName = $("input[name='deptName']").val();
            var name = $("input[name='name']").val();
            var userNum = $("input[name='userNum']").val();
            var address = $("input[name='address']").val();
            var userType = $.form.selectCheckeds("userType");
            var upStructure = $.form.selectSelects("upStructure");
            var voltageGrade = $.form.selectSelects("voltageGrade");
            var useEleType = $.form.selectSelects("useEleType");
            var useEleChangeType = $.form.selectSelects("useEleChangeType");
            $.ajax({
                cache : true,
                type : "POST",
                url : ctx + "basics/user/edit",
                data : {
                    "id": id,
                    "deptId": deptId,
                    "deptName": deptName,
                    "name": name,
                    "userNum": userNum,
                    "address": address,
                    "userType": userType,
                    "upStructure": upStructure,
                    "voltageGrade": voltageGrade,
                    "useEleType": useEleType,
                    "useEleChangeType": useEleChangeType
                },
                async : false,
                error : function(request) {
                    $.modal.alertError("系统错误");
                },
                success : function(data) {
                    $.operate.successCallback(data);
                }
            });
        }

		/*用户管理-新增-选择部门树*/
        function selectDeptTree() {
            var treeId = $("#treeId").val();
            var deptId = $.common.isEmpty(treeId) ? "100" : $("#treeId").val();
            var url = ctx + "system/dept/selectDeptTree/" + deptId;
            var options = {
                title: '选择所属供电企业',
                width: "380",
                url: ctx + "system/dept/selectDeptTree/" + deptId,
                callBack: doSubmit
            };
            $.modal.openOptions(options);
        }
        function doSubmit(index, layero){
            var tree = layero.find("iframe")[0].contentWindow.$._tree;
            if ($.tree.notAllowParents(tree)) {
                var body = layer.getChildFrame('body', index);
                $(".userType").prop("checked",true);
                $("#treeId").val(body.find('#treeId').val());
                $("#treeName").val(body.find('#treeName').val());
                layer.close(index);
            }
        }
	</script>
</body>
</html>
